<template>
    <van-nav-bar title="订单" />
    <!-- 车辆消息 -->
    <van-card v-for="item in carlst" :key="item.id" :num="item.count" :price="item.price" :desc="item.desc"
        :title="item.name" :thumb="item.img">
        <template #tags>
            <!-- <van-tag plain type="primary">标签</van-tag> -->
            <van-stepper v-model="item.count" input-width="30px" button-size="20px" />
        </template>
        <template #footer>
            <van-button size="mini">看详情</van-button>
            <van-button size="mini" @click="oncart(item.id, item.count)">添加购物车</van-button>
        </template>
    </van-card>
    <!-- 优惠券单元格 -->
    <van-coupon-cell :coupons="coupons" :chosen-coupon="chosenCoupon" @click="showList = true" />
    <!-- 优惠券列表 -->
    <van-popup v-model:show="showList" round position="bottom" style="height: 90%; padding-top: 4px;">
        <van-coupon-list :coupons="coupons" :chosen-coupon="chosenCoupon" :disabled-coupons="disabledCoupons"
            @change="onChange" @exchange="onExchange"/>
    </van-popup>

    <van-submit-bar :price="price" button-text="提交订单" @submit="onSubmit" />
</template>
<script setup>
import { useRouter } from 'vue-router'
import { useRoute } from 'vue-router';
import { ref, onMounted } from 'vue'
import http from '../../http';
const router = useRouter()
const route = useRoute()
const carlst = ref([])
const price = JSON.parse(route.query.price)
const goods = JSON.parse(route.query.goods)

const disabledCoupons = ref([]);
const coupons = ref([
    {
        available: 1,
        condition: '无门槛\n最多优惠12元',
        reason: '',
        value: 150,
        name: '优惠券名称',
        startAt: 1489104000,
        endAt: 1514592000,
        valueDesc: '1.5',
        unitDesc: '元',
    },
    {
        available: 2,
        condition: '无门槛\n最多优惠12元',
        reason: '',
        value: 150,
        name: '优惠券名称',
        startAt: 1489104000,
        endAt: 1514592000,
        valueDesc: '1.5',
        unitDesc: '元',
    },
    {
        available: 3,
        condition: '无门槛\n最多优惠12元',
        reason: '',
        value: 150,
        name: '优惠券名称',
        startAt: 1489104000,
        endAt: 1514592000,
        valueDesc: '1.5',
        unitDesc: '元',
    },
]);
const showList = ref(false);
const chosenCoupon = ref(-1);

const onChange = (index) => {
    showList.value = false;
    chosenCoupon.value = index;
};
const onExchange = (code) => {
    coupons.value.push(coupon);
};




const getCarData = () => {
    http.get("car/car/").then(res => {
        const count = res.data.data.length
        for (let i = 0; i < count; i++) {
            if (goods.includes(String(res.data.data[i].id))) {
                carlst.value.push(res.data.data[i])
            }
        }
    })
}
const onSubmit = () => {
    http.post('shop/order/', {
        userid: localStorage.getItem('userid'),
        price: price.value,
        clist: checkedResult.value
    }).then(res => {
        if (res.data.code === 200) {
            router.push('/pay')
        }
    })
}
onMounted(() => {
    getCarData()
})
</script>
<style scoped></style>